<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>小米官网</title>
    <link rel="stylesheet" href="reset.css">
    <link rel="stylesheet" href="css.css">
    <link rel="stylesheet" href="swiper-5.4.5/package/css/swiper.min.css">

</head>

<body>
    <div class="toptop">
        <div class="top w ">
            <div class="top-nav">
                <a href="">小米商城</a>
                <span class="sep">|</span>
                <a href="">MIUI</a>
                <span class="sep">|</span>
                <a href="">loT</a>
                <span class="sep">|</span>
                <a href="">云服务</a>
                <span class="sep">|</span>
                <a href="">天星数科</a>
                <span class="sep">|</span>
                <a href="">有品</a>
                <span class="sep">|</span>
                <a href="">小爱开发平台</a>
                <span class="sep">|</span>
                <a href="">企业团购</a>
                <span class="sep">|</span>
                <a href="">资质证照</a>
                <span class="sep">|</span>
                <a href="">协议规则</a>
                <span class="sep">|</span>
                <a href="">下载app</a>
                <span class="sep">|</span>
                <a href="">智能生活</a>
                <span class="sep">|</span>
                <a href="">Select Location</a>
            </div>
            <div class="top-info">
                <a href="./login.html">登录</a>
                <span class="sep">|</span>
                <a href="./register.html">注册</a>
                <span class="sep">|</span>
                <a href="">消息通知</a>
            </div>
            <div class="top-car">
                <img src="img/d7db56d1d850113f016c95e289e36efa.png" alt="" >
                购物车
            </div>
        </div>
    </div>

    <div class="container-container">
        <!-- logo -->
        <div class="container">
            <div class="header-logo ">
                <a href=""><img src="img/logo-mi2.png" alt=""></a>
            </div>

            <div class="header-nav ">
                <ul class="top-nav">
                    <li><a href="">小米手机</a></li>
                    <li><a href="">Redmi 红米</a></li>
                    <li><a href="">电视</a></li>
                    <li><a href="">笔记本</a></li>
                    <li><a href="">家电</a></li>
                    <li><a href="">路由器</a></li>
                    <li><a href="">智能硬件</a></li>
                    <li><a href="">服务</a></li>
                    <li><a href="">社区</a></li>
                    <ul>
                       
                    </ul>
                </ul>
                <ul class="left-nav">
                    <li><a href="">手机 电话卡</a><span>></span></li>
                    <li><a href="">电视 盒子</a><span>></span></li>
                    <li><a href="">笔记本 显示器</a><span>></span></li>
                    <li><a href="">家电 插线板</a><span>></span></li>
                    <li><a href="">出行 穿戴</a><span>></span></li>
                    <li><a href="">智能 路由器</a><span>></span></li>
                    <li><a href="">电源 配件</a><span>></span></li>
                    <li><a href="">健康 儿童</a><span>></span></li>
                    <li><a href="">耳机 音箱</a><span>></span></li>
                    <li><a href="">生活 箱包</a><span>></span></li>

                    <ul>
                    </ul>
                </ul>
            </div>

            <div class="header-search">
                <input type="text" placeholder="请输入想要查找的商品">
                <input type="button">
            </div>

        </div>

        <!-- 轮播图 -->
        <div class="swiper w">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"><img src="img/1c3e97686468231f3f78048d7f2b7fdc.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="img/a5ebb3ecd10ba5b5f1fa25125d034492.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="img/34151fee7afb74b91c3a39ae8d85c8d8.jpg" alt=""></div>
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>

                <!-- 如果需要导航按钮 -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>

                <!-- 如果需要滚动条 -->
                <!-- <div class="swiper-scrollbar"></div> -->
            </div>

            <script src="swiper-5.4.5/package/js/swiper.min.js"></script>
            <script>
                var mySwiper = new Swiper('.swiper-container', {
                    // direction: 'vertical', // 垂直切换选项
                    loop: true, // 循环模式选项

                    // 如果需要分页器
                    pagination: {
                        el: '.swiper-pagination',
                    },

                    // 如果需要前进后退按钮
                    navigation: {
                        nextEl: '.swiper-button-next',
                        prevEl: '.swiper-button-prev',
                    },
                    autoplay:{
        pagination: '.swiper-pagination',
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
        paginationClickable: true,
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: 500,
        autoplayDisableOnInteraction: false
            }

                    // 如果需要滚动条
                    // scrollbar: {
                    //     el: '.swiper-scrollbar',
                    // },
                })
            </script>
        </div>

        <!-- home -->
        <div class="home w">
            <div class="home-left">
                <ul>
                    <li><img src="img/82abdba456e8caaea5848a0cddce03db.png" alt="">
                        <p>小米秒杀</p>
                    </li>
                    <li><img src="img/806f2dfb2d27978e33fe3815d3851fa3.png" alt="">
                        <p>企业团购</p>
                    </li>
                    <li><img src="img/eded6fa3b897a058163e2485532c4f10.png" alt="">
                        <p>F码通道</p>
                    </li>
                    <li><img src="img/43a3195efa6a3cc7662efed8e7abe8bf.png" alt="">
                        <p>米粉卡</p>
                    </li>
                    <li><img src="img/f4846bca6010a0deb9f85464409862af.png" alt="">
                        <p>以旧换新</p>
                    </li>
                    <li><img src="img/9a76d7636b08e0988efb4fc384ae497b.png" alt="">
                        <p>话费充值</p>
                    </li>
                </ul>
            </div>
            <div class="home-right">
                <ul>
                    <li><img src="img/5d4298059889417157e8492750328492.jpg" alt=""></li>
                    <li><img src="img/b30177d629bfbe2fb42251c1b8538f7b.jpg" alt=""></li>
                    <li><img src="img/793913688bfaee26b755a0b0cc8575fd.jpg" alt=""></li>
                </ul>
            </div>
        </div>
    </div>

    <!-- 秒杀 视频 -->
    <div class="mainmain">

<!-- 秒杀 -->
<div class="row w">
        <h2>小米秒杀
            <div class="ms-swiper-controls">
                <span class="ms-prev">
                    <</span> <span class="ms-next">>
                </span>
            </div>

        </h2>

        <div class="ms">
            <h2 id="round"></h2>
            <img src="img/AQYAFYR6skFSqBUAAAAASUVORK5CYII_.jpg" alt="">
            <p>距离结束还有：</p>
            <div class="ms-time">
                <span></span>
                <i>:</i>
                <span></span>
                <i>:</i>
                <span></span>
            </div>
        </div>

        <div class="ms-right">
            <ul class="ms-ul">
                <li><img src="img/0497ba8520dc4aca9d55e6b841d42331.jpg" alt=""></li>
                <li><img src="img/6874615b3c50e837ffe532eb6ea4ef1a.jpg" alt=""></li>
                <li><img src="img/0497ba8520dc4aca9d55e6b841d42331.jpg" alt=""></li>
                <li><img src="img/6874615b3c50e837ffe532eb6ea4ef1a.jpg" alt=""></li>
                <li><img src="img/0497ba8520dc4aca9d55e6b841d42331.jpg" alt=""></li>
                <li><img src="img/6874615b3c50e837ffe532eb6ea4ef1a.jpg" alt=""></li>
            </ul>

        </div>
        <div class="ms-gg">
            <img src="img/431e5fd6bfd1b67d096928248be18303.jpg" alt="">
        </div>
    </div>

    <!-- 产品 手机 1 -->
    <div class="box-cp w">
        <h2 class="title">手机
            <div class="more">
                <a href="">查看更多</a>
                <i>></i>
            </div>
        </h2>

        <div class="box-cp-left">
            <img src="img/c583f2edc613f1be20fa415910b13ce3.jpg" alt="">
        </div>

        <div class="box-cp-right">
            <ul>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/b3553083a4975325eab6470d94465548.jpg" alt="">
                    </div>
                    <h3>小米10S</h3>
                    <h2>骁龙870 丨 对称式双扬立体声</h2>
                    <p>3299元起</p>
                </li>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/34caee2c867bfd8c5e0dc2d8c663e121.jpg" alt="">
                    </div>
                    <h3>小米11 PRO</h3>
                    <h2>1.12"GN2 丨 骁龙888</h2>
                    <p>4999元起</p>
                </li>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/cb554f30eaa0316b0a736c3d59f21584.jpg" alt="">
                    </div>
                    <h3>小米11 青春版</h3>
                    <h2>小米11 青春版 轻薄</h2>
                    <p>2299元起</p>
                </li>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/c21247abf4bc610cd86fe00601b0f766.jpg" alt="">
                    </div>
                    <h3>黑鲨4</h3>
                    <h2>黑鲨4 磁动力升降启键</h2>
                    <p>2499元起</p>
                </li>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/b3553083a4975325eab6470d94465548.jpg" alt="">
                    </div>
                    <h3>小米10S</h3>
                    <h2>骁龙870 丨 对称式双扬立体声</h2>
                    <p>3299元起</p>
                </li>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/34caee2c867bfd8c5e0dc2d8c663e121.jpg" alt="">
                    </div>
                    <h3>小米11 PRO</h3>
                    <h2>1.12"GN2 丨 骁龙888</h2>
                    <p>4999元起</p>
                </li>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/cb554f30eaa0316b0a736c3d59f21584.jpg" alt="">
                    </div>
                    <h3>小米11 青春版</h3>
                    <h2>小米11 青春版 轻薄</h2>
                    <p>2299元起</p>
                </li>
                <li>
                    <div class="box-cp-right-img">
                        <img src="img/c21247abf4bc610cd86fe00601b0f766.jpg" alt="">
                    </div>
                    <h3>黑鲨4</h3>
                    <h2>黑鲨4 磁动力升降启键</h2>
                    <p>2499元起</p>
                </li>
            </ul>
        </div>

        <img src="img/41d16e66381cfeda7b6b39ab67678d5e.jpg" alt="">

    </div>

    <!-- 产品 家电 2 -->

    <div class="box-cp2 w">
        <h2 class="title">家电
            <div class="more">
                <a href="">热门</a>
                <a href="">电视影音</a>
            </div>
        </h2>

        <div class="box-cp2-left">
            <img src="img/116fc43816b87192be4e67cf762e8da5.jpg" alt="">
            <img src="img/dfbdabe36b2d630d57a015e6fb5eb3ea.jpg" alt="">
        </div>

        <div class="box-cp2-right">
            <ul>
                <li>
                    <div class="box-cp2-right-img">
                        <img src="img/03a9e7e96a09d256ca1badeec186c859.jpg" alt="">
                    </div>
                    <h3>小米全面屏电视65英寸 E65X</h3>
                    <h2>全面屏设计</h2>
                    <p><span>3099元</span><del>3299元</del></p>
                </li>
                <li>
                    <div class="box-cp2-right-img">
                        <img src="img/20d36fbaa18625e4fe507af31e4e9f83.jpg" alt="">
                    </div>
                    <h3>全面屏电视E43K</h3>
                    <h2>全面屏设计，海量内容</h2>
                    <p><span>1388元</span><del>1500元</del></p>
                </li>
                <li>
                    <div class="box-cp2-right-img">
                        <img src="img/9d8674cd21c486feff5328772ab9cf01.jpg" alt="">
                    </div>
                    <h3>小米电视4A 70英寸</h3>
                    <h2>大屏更享受</h2>
                    <p><span>3699元</span><del>3999元</del></p>
                </li>
                <li>
                    <div class="box-cp2-right-img">
                        <img src="img/6bed167fc905bab57dee478bcf1e5e0d.jpg" alt="">
                    </div>
                    <h3>米家互联网对开门冰箱 540L</h3>
                    <h2>重磅新品福利特惠</h2>
                    <p><span>2899元</span><del>3690元</del></p>
                </li>
                <li>
                    <div class="box-cp2-right-img">
                        <img src="img/03a9e7e96a09d256ca1badeec186c859.jpg" alt="">
                    </div>
                    <h3>小米全面屏电视65英寸 E65X</h3>
                    <h2>全面屏设计</h2>
                    <p><span>3099元</span><del>3299元</del></p>
                </li>
                <li>
                    <div class="box-cp2-right-img">
                        <img src="img/20d36fbaa18625e4fe507af31e4e9f83.jpg" alt="">
                    </div>
                    <h3>全面屏电视E43K</h3>
                    <h2>全面屏设计，海量内容</h2>
                    <p><span>1388元</span><del>1500元</del></p>
                </li>
                <li>
                    <div class="box-cp2-right-img">
                        <img src="img/9d8674cd21c486feff5328772ab9cf01.jpg" alt="">
                    </div>
                    <h3>小米电视4A 70英寸</h3>
                    <h2>大屏更享受</h2>
                    <p><span>3699元</span><del>3999元</del></p>
                </li>
                <li>
                    <div class="last-top">
                        <h3>小米电烤箱</h3>
                        <p>299元</p>
                        <img src="img/1612c93ad4756215774a0dbec7a81bb2.jpg" alt="">
                    </div>

                    <div class="last-bottom">
                        <h3>浏览更多</h3>
                        <p>热门</p>
                        <img src="img/favicon.ico" alt="">

                    </div>
                </li>
            </ul>
        </div>

        <img src="img/59e8fc8ba9718c266882719fb4bbcedd.jpg" alt="">

    </div>

    <!-- 产品 智能 3 -->

    <div class="box-cp3 w">
        <h2 class="title">智能
            <div class="more">
                <a href="">热门</a>
                <a href="">安防</a>
                <a href="">出行</a>
            </div>
        </h2>

        <div class="box-cp3-left">
            <img src="img/ffe114f73fac3a45e5622c3eff56106b.jpg" alt="">
            <img src="img/a660ce095e8f553a9ed1515265f4e9fc.jpg" alt="">
        </div>

        <div class="box-cp3-right">
            <ul>
                <li>
                    <div class="box-cp3-right-img">
                        <img src="img/e7c6e79433c883e1a022ec21402c1679.jpg" alt="">
                    </div>
                    <h3>小米小爱音箱Play</h3>
                    <h2>新音乐、语音遥控家电</h2>
                    <p><span>109元</span><del>160元</del></p>
                </li>
                <li>
                    <div class="box-cp3-right-img">
                        <img src="img/3accd497afc0047cfbd40f442e3b17df.jpg" alt="">
                    </div>
                    <h3>小米智能窗帘</h3>
                    <h2>窗帘开仓随心控</h2>
                    <p><span>799元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp3-right-img">
                        <img src="img/550177d2e54387521bce9e78cb2949dd.jpg" alt="">
                    </div>
                    <h3>小米体重秤</h3>
                    <h2>轻松掌握身体脂肪率</h2>
                    <p><span>99元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp3-right-img">
                        <img src="img/T1r_x_BgLT1RXrhCrK.jpg" alt="">
                    </div>
                    <h3>九号平衡车</h3>
                    <h2>年轻人的酷玩具</h2>
                    <p><span>1849元</span><del>1999元</del></p>
                </li>
                <li>
                    <div class="box-cp3-right-img">
                        <img src="img/3accd497afc0047cfbd40f442e3b17df.jpg" alt="">
                    </div>
                    <h3>小米智能窗帘</h3>
                    <h2>窗帘开仓随心控</h2>
                    <p><span>799元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp3-right-img">
                        <img src="img/550177d2e54387521bce9e78cb2949dd.jpg" alt="">
                    </div>
                    <h3>小米体重秤</h3>
                    <h2>轻松掌握身体脂肪率</h2>
                    <p><span>99元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp3-right-img">
                        <img src="img/T1r_x_BgLT1RXrhCrK.jpg" alt="">
                    </div>
                    <h3>九号平衡车</h3>
                    <h2>年轻人的酷玩具</h2>
                    <p><span>1849元</span><del>1999元</del></p>
                </li>
                <li>
                    <div class="last-top">
                        <h3>小米电烤箱</h3>
                        <p>299元</p>
                        <img src="img/f10b003b4ff46c59f5736e8f324af034.jpg" alt="">
                    </div>

                    <div class="last-bottom">
                        <h3>浏览更多</h3>
                        <p>热门</p>
                        <img src="img/favicon.ico" alt="">

                    </div>
                </li>
            </ul>
        </div>

        <img src="img/01cc6a570d32a2ee09a2d5c2009a9968.jpg" alt="">

    </div>

    <!-- 产品 搭配 4 -->

    <div class="box-cp4 w">
        <h2 class="title">搭配
            <div class="more">
                <a href="">热门</a>
                <a href="">耳机音箱</a>
            </div>
        </h2>

        <div class="box-cp4-left">
            <img src="img/6874615b3c50e837ffe532eb6ea4ef1a.jpg" alt="">
            <img src="img/9f6c89cf21efc23799f6130224cef007.jpg" alt="">
        </div>

        <div class="box-cp4-right">
            <ul>
                <li>
                    <div class="box-cp4-right-img">
                        <img src="img/5fc35cf0af915a9e60f5d4ea220521ab.jpg" alt="">
                    </div>
                    <h3>小米真无线蓝牙耳机Air 2 Pro</h3>
                    <h2> 主动降噪/持久续航/无线充</h2>
                    <p><span>649元</span><del>800元</del></p>
                </li>
                <li>
                    <div class="box-cp4-right-img">
                        <img src="img/9eb0178e3bfeb7d170edd641fb4be4bc.jpg" alt="">
                    </div>
                    <h3>高速无线充套装</h3>
                    <h2>快速无线闪充，Qi充电标准</h2>
                    <p><span>149元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp4-right-img">
                        <img src="img/7d9e8308f5f55bfa69c5c7fadc7cb4aa.jpg" alt="">
                    </div>
                    <h3> Redmi AirDots 2真无线蓝牙耳机</h3>
                    <h2>支持蓝牙5.0，自动秒连，拿起就能用</h2>
                    <p><span>99元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp4-right-img">
                        <img src="img/c6306bf6d8aede9f6f48d8e4d9256db2.jpg" alt="">
                    </div>
                    <h3> 小米真无线蓝牙耳机Air 2s</h3>
                    <h2>全面升级，智慧真无线</h2>
                    <p><span>359元</span><del>399元</del></p>
                </li>
                <li>
                    <div class="box-cp4-right-img">
                        <img src="img/5fc35cf0af915a9e60f5d4ea220521ab.jpg" alt="">
                    </div>
                    <h3>小米真无线蓝牙耳机Air 2 Pro</h3>
                    <h2> 主动降噪/持久续航/无线充</h2>
                    <p><span>649元</span><del>800元</del></p>
                </li>
                <li>
                    <div class="box-cp4-right-img">
                        <img src="img/9eb0178e3bfeb7d170edd641fb4be4bc.jpg" alt="">
                    </div>
                    <h3>高速无线充套装</h3>
                    <h2>快速无线闪充，Qi充电标准</h2>
                    <p><span>149元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp4-right-img">
                        <img src="img/7d9e8308f5f55bfa69c5c7fadc7cb4aa.jpg" alt="">
                    </div>
                    <h3> Redmi AirDots 2真无线蓝牙耳机</h3>
                    <h2>支持蓝牙5.0，自动秒连，拿起就能用</h2>
                    <p><span>99元</span><del></del></p>
                </li>
                <li>
                    <div class="last-top">
                        <h3>小米小爱触碰音箱</h3>
                        <p>219元</p>
                        <img src="img/9946e252a7c49662376c056ced004a20.jpg" alt="">
                    </div>

                    <div class="last-bottom">
                        <h3>浏览更多</h3>
                        <p>热门</p>
                        <img src="img/favicon.ico" alt="">

                    </div>
                </li>
            </ul>
        </div>

        <img src="img/89c2a209b742fce9b10d9d196149d634.jpg" alt="">

    </div>

    <!-- 产品  配件 5 -->

    <div class="box-cp5 w">
        <h2 class="title">配件
            <div class="more">
                <a href="">热门</a>
                <a href="">充电器</a>
            </div>
        </h2>

        <div class="box-cp5-left">
            <img src="img/9f64bbd58c3f5001bdf0688894f22cb6.jpg" alt="">
            <img src="img/ffe4182f1d9a5befdf2380ec90ae1620.jpg" alt="">
        </div>

        <div class="box-cp5-right">
            <ul>
                <li>
                    <div class="box-cp5-right-img">
                        <img src="img/f8fde8a877fd4b12ad88119d9b6bc061.jpg" alt="">
                    </div>
                    <h3>小米氮化镓GaN充电器 Type-C 65W </h3>
                    <h2> 氮化镓黑科技 65W MAX 大功率快充</h2>
                    <p><span>149元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp5-right-img">
                        <img src="img/9eb0178e3bfeb7d170edd641fb4be4bc.jpg" alt="">
                    </div>
                    <h3>高速无线充套装</h3>
                    <h2>快速无线闪充，Qi充电标准</h2>
                    <p><span>149元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp5-right-img">
                        <img src="img/1f32af53d1ad60f4980146f6a2b81019.jpg" alt="">
                    </div>
                    <h3> 小米无线充电宝青春版10000mAh</h3>
                    <h2>能量满满，无线有线都能充</h2>
                    <p><span>120元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp5-right-img">
                        <img src="img/01dba858b327eeeadf34ce8a1d794ed4.jpg" alt="">
                    </div>
                    <h3> 小米车载充电器快充版</h3>
                    <h2>双口快充，安全稳定</h2>
                    <p><span>59元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp5-right-img">
                        <img src="img/f8fde8a877fd4b12ad88119d9b6bc061.jpg" alt="">
                    </div>
                    <h3>小米氮化镓GaN充电器 Type-C 65W </h3>
                    <h2> 氮化镓黑科技 65W MAX 大功率快充</h2>
                    <p><span>149元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp5-right-img">
                        <img src="img/9eb0178e3bfeb7d170edd641fb4be4bc.jpg" alt="">
                    </div>
                    <h3>高速无线充套装</h3>
                    <h2>快速无线闪充，Qi充电标准</h2>
                    <p><span>149元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp5-right-img">
                        <img src="img/1f32af53d1ad60f4980146f6a2b81019.jpg" alt="">
                    </div>
                    <h3> 小米无线充电宝青春版10000mAh</h3>
                    <h2>能量满满，无线有线都能充</h2>
                    <p><span>120元</span><del></del></p>
                </li>
                <li>
                    <div class="last-top">
                        <h3>小米二合一数据线100cm</h3>
                        <p>21.9元</p>
                        <img src="img/573e9cb39b0d8c7f2cd063621142fe44.jpg" alt="">
                    </div>

                    <div class="last-bottom">
                        <h3>浏览更多</h3>
                        <p>热门</p>
                        <img src="img/favicon.ico" alt="">

                    </div>
                </li>
            </ul>
        </div>

        <img src="img/66523a1accdc72e01c01d4761a26fbb9.jpg" alt="">

    </div>

    <!-- 产品 周边 6 -->
    <div class="box-cp6 w">
        <h2 class="title">周边
            <div class="more">
                <a href="">热门</a>
                <a href="">出行</a>
            </div>
        </h2>

        <div class="box-cp6-left">
            <img src="img/ca0940f052227d235e7de5678d106c89.jpg" alt="">
            <img src="img/0497ba8520dc4aca9d55e6b841d42331.jpg" alt="">
        </div>

        <div class="box-cp6-right">
            <ul>
                <li>
                    <div class="box-cp6-right-img">
                        <img src="img/cccac948e1b8ffb47f1fecde67692e60.jpg" alt="">
                    </div>
                    <h3>米家飞行员太阳镜 Pro</h3>
                    <h2>尼龙偏光，轻巧佩戴</h2>
                    <p><span>189元</span><del>199元</del></p>
                </li>
                <li>
                    <div class="box-cp6-right-img">
                        <img src="img/57433a4b991b2a2ddc889f2d8d434655.jpg" alt="">
                    </div>
                    <h3>小米巨能写中性笔10支装</h3>
                    <h2>一支顶4支，超长顺滑书写</h2>
                    <p><span>9.99元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp6-right-img">
                        <img src="img/03d94ee6059481a6adcb6c4c5c572fb4.jpg" alt="">
                    </div>
                    <h3>米家迷你保温杯</h3>
                    <h2>可以随身携带的温度</h2>
                    <p><span>49元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp6-right-img">
                        <img src="img/d0b1119165c481376399aab53330e015.jpg" alt="">
                    </div>
                    <h3>米家运动鞋4</h3>
                    <h2>轻盈若絮,弹若脱兔</h2>
                    <p><span>169元</span><del>190元</del></p>
                </li>
                <li>
                    <div class="box-cp6-right-img">
                        <img src="img/cccac948e1b8ffb47f1fecde67692e60.jpg" alt="">
                    </div>
                    <h3>米家飞行员太阳镜 Pro</h3>
                    <h2>尼龙偏光，轻巧佩戴</h2>
                    <p><span>189元</span><del>199元</del></p>
                </li>
                <li>
                    <div class="box-cp6-right-img">
                        <img src="img/57433a4b991b2a2ddc889f2d8d434655.jpg" alt="">
                    </div>
                    <h3>小米巨能写中性笔10支装</h3>
                    <h2>一支顶4支，超长顺滑书写</h2>
                    <p><span>9.99元</span><del></del></p>
                </li>
                <li>
                    <div class="box-cp6-right-img">
                        <img src="img/03d94ee6059481a6adcb6c4c5c572fb4.jpg" alt="">
                    </div>
                    <h3>米家迷你保温杯</h3>
                    <h2>可以随身携带的温度</h2>
                    <p><span>49元</span><del></del></p>
                </li>
                <li>
                    <div class="last-top">
                        <h3>日常元素抽纸青春版 24包/箱</h3>
                        <p>31.9元</p>
                        <img src="img/b48160e1c150044808c9c8787c140750.jpg" alt="">
                    </div>

                    <div class="last-bottom">
                        <h3>浏览更多</h3>
                        <p>热门</p>
                        <img src="img/favicon.ico" alt="">

                    </div>
                </li>
            </ul>
        </div>

        <img src="img/88e35cffc82cd98cd53172460067af17.jpg" alt="">

    </div>

    <!-- 视频 -->
    <div class="box-sp w">
        <h2 class="title">视频<div class="more">
                <a href="">查看更多</a>
                <i>></i>
            </div>
        </h2>

        <div class="box-sp-bottom">
            <ul class="sp">
                <li>
                    <div class="figure">
                        <img src="img/e74c4ff741bcdfc5b28a48a43e4edc6d.jpg" alt="">
                        <span class="play">></span>
                    </div>
                    <p>2021年春季新品发布会第一场</p>
                </li>
                <li>
                    <div class="figure">
                        <img src="img/101b19aca4bb489bcef0f503e44ec866.jpg" alt="">
                        <span class="play">></span>
                    </div>
                    <p>Redmi 10X系列发布会</p>
                </li>
                <li>
                    <div class="figure">
                        <img src="img/96563e75833ba4563bd469dd28203b09.jpg" alt="">
                        <span class="play">></span>
                    </div>
                    <p>小米10 青春版 发布会</p>
                </li>
                <li>
                    <div class="figure">
                        <img src="img/2fd26bb99b723337a2f8eaba84f7d5bb.jpg" alt="">
                        <span class="play">></span>
                    </div>
                    <p>小米10 8K手机拍大片</p>
                </li>
            </ul>
        </div>
    </div>
    </div>
    
    <!-- footer -->
    <div class="footer w">
        <div class="footer-service">
            <ul>
                <li><a href="">预约维护服务</a></li>
                <li><a href="">7天无理由退货</a></li>
                <li><a href="">15天免费换货</a></li>
                <li><a href="">满69包邮</a></li>
                <li><a href="">520余家售后网点</a></li>
            </ul>
        </div>

        <div class="footer-links">
            <dl>
                <dt>帮助中心</dt>
                <dd>账户管理</dd>
                <dd>购物指南</dd>
                <dd>订单操作</dd>
            </dl>
            <dl>
                <dt>服务支持</dt>
                <dd>售后政策</dd>
                <dd>自助服务</dd>
                <dd>相关下载</dd>
            </dl>
            <dl>
                <dt>线下门店</dt>
                <dd>小米之家</dd>
                <dd>服务网点</dd>
                <dd>授权体验店</dd>
            </dl>
            <dl>
                <dt>关于小米</dt>
                <dd>了解小米</dd>
                <dd>加入小米</dd>
                <dd>投资者关系</dd>
                <dd>企业社会责任</dd>
                <dd>廉洁举报</dd>
            </dl>
            <dl>
                <dt>关于我们</dt>
                <dd>新浪微博</dd>
                <dd>官方微信</dd>
                <dd>联系我们</dd>
                <dd>公益基金会</dd>
            </dl>
            <dl>
                <dt>特色服务</dt>
                <dd>F码通道</dd>
                <dd>礼物码</dd>
                <dd>防伪查询</dd>
            </dl>

            <div class="footer-right">
                <h3>400-100-5678</h3>
                <p>8:00-18:00（仅收市话费）</p>
                <a href="">人工客服</a>
                <div class="follow">
                    关注小米：
                    <img src="img/wb.png" alt="">
                    <img src="img/wx.png" alt="">
                </div>
            </div>
        </div>

    </div>

    <!-- info -->
    <div class="infoinfo">
            <div class="info w">
        <div class="info-container">
            <div class="info-logo">
                <img src="img/logo-mi2.png" alt="">
            </div>

            <div class="info-text">
                <p><a href="">小米商城</a><span>丨</span>
                    <a href="">MIUI</a><span>丨</span>
                    <a href="">米家</a><span>丨</span>
                    <a href="">米聊</a><span>丨</span>
                    <a href="">多看</a><span>丨</span>
                    <a href="">游戏</a><span>丨</span>
                    <a href="">政企服务</a><span>丨</span>
                    <a href="">小米天猫店</a><span>丨</span>
                    <a href="">小米集团隐私政策</a><span>丨</span>
                    <a href="">小米商城用户协议</a><span>丨</span>
                    <a href="">问题反馈</a><span>丨</span>
                    <a href="">Select Location</a></p>

                <p>
                    <a href="">小米互联网法院法律服务工作站</a><span>丨</span>
                    <a href="">中国消费者协会</a><span>丨</span>
                    <a href="">北京市消费协会</a>
                </p>
                <h6>© mi.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2020]0276-042号
                    <br>
                        （京）网械平台备字（2018）第00005号 互联网药品信息服务资格证 (京)-非经营性-2014-0090 营业执照 医疗器械质量公告
                        <br>
                        增值电信业务许可证 网络食品经营备案 京食药网食备202010048   食品经营许可证
                        <br>
                        违法和不良信息举报电话：171-5104-4404 知识产权侵权投诉 本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</h6>
            </div>

            <div class="info-img">
                <img src="img/truste.png" alt="">
                <img src="img/v-logo-2.png" alt="">
                <img src="img/icon3.png" alt="">
                <img src="img/ba10428a4f9495ac310fd0b5e0cf8370.png" alt="">
                <img src="img/2562913da1f1420592a777b69c16134b.png" alt="">
            </div>
        </div>

        <!-- 口号 -->
        <div class="slogan">
           
        </div>
    </div>
    </div>

    <!-- 回到顶部 -->
    <div class="comeback">
        <ul>
            <li><span><img src="img/98a23aae70f25798192693f21c4d4039.png" alt=""></span>
            <p>手机APP</p></li>
            <li><span><img src="img/55cad219421bee03a801775e7309b920.png" alt=""></span>
                <p>个人中心</p></li>
            <li><span><img src="img/12eb0965ab33dc8e05870911b90f3f13.png" alt=""></span>
                <p>售后服务</p></li>
            <li><span><img src="img/4f036ae4d45002b2a6fb6756cedebf02.png" alt=""></span>
                <p>人工客户</p></li>
            <li><span><img src="img/d7db56d1d850113f016c95e289e36efa.png" alt=""></span>
                <p>购物车</p></li>
            <li><span><img src="img/totop.png" alt=""></span>
            <p>回顶部</p></li>
        </ul>
    </div>

</body>

</html>
<script src="jquery-1.12.4.js"></script>
<script src="js.js"></script>